<!--
  ~ This program is part of the OpenLMIS logistics management information system platform software.
  ~ Copyright © 2013 VillageReach
  ~
  ~ This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
  ~  
  ~ This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
  ~ You should have received a copy of the GNU Affero General Public License along with this program.  If not, see http://www.gnu.org/licenses.  For additional information contact info@OpenLMIS.org. 
  -->

<div>
  <h2><span openlmis-message="schedules.header"></span>
    <a href="#" id="schedule-add-new" class="pull-right btn btn-primary" ng-click="startAddNewSchedule()"
       openlmis-message="button.add.new"></a>
  </h2>


  <div ng-hide="scheduleLoaded()" openlmis-message="msg.loading"></div>
  <div ng-show="scheduleLoaded()">
    <div class="alert alert-success" id="saveSuccessMsgDiv" ng-bind="message" ng-show="message"/>
    <div class="list-header-container">
      <div class="row-fluid list-header">
        <div class="span1">&nbsp;</div>
        <div class="span2" openlmis-message="header.code"></div>
        <div class="span2" openlmis-message="header.name"></div>
        <div class="span4" openlmis-message="label.description"></div>
        <div class="span2" openlmis-message="header.lastModified"></div>
        <div class="span1">&nbsp;</div>
      </div>
    </div>

    <div class="list-container">
      <form class="schedule-form" id="createScheduleForm" ng-show="newScheduleMode" name="createScheduleForm"
            ng-submit="createSchedule()" novalidate>
        <div ng-class="formActive">
          <div class="row-fluid list-row">
            <div class="span1"></div>
            <div class="span2">
              <input name="code" id="code" type="text" ng-model="newSchedule.code" maxlength="50"
                     ng-required="true"
                     openlmis-message="placeholder.code"/>
              <span class="label-required">*</span>
            <span class="form-error"
                  ng-show="createScheduleForm.code.$error.required && showErrorForCreate"
                  openlmis-message="missing.value"></span>
            </div>
            <div class="span2">
              <input name="name" id="name" type="text" ng-model="newSchedule.name" maxlength="50"
                     ng-required="true"
                     openlmis-message="placeholder.name"/>
              <span class="label-required">*</span>
            <span class="form-error"
                  ng-show="createScheduleForm.name.$error.required && showErrorForCreate"
                  openlmis-message="missing.value"></span>
            </div>
            <div class="span4">
              <input name="description" id="description" type="text" ng-model="newSchedule.description"
                     maxlength="250" openlmis-message="placeholder.description.optional"/>
            </div>
            <div class="span2">
              &nbsp;
            </div>
          </div>
          <div class="row-fluid save-cancel-row">
            <div class="span1"></div>
            <div class="span2">
              <input id="createSchedule" type="submit" class="btn btn-primary btn-small"
                     openlmis-message="button.create"/>
              <input type="button" class="btn btn-cancel btn-small" openlmis-message="button.cancel"
                     ng-click="cancelAddNewSchedule()"/>
            </div>
            <div ng-show="creationError" class="span9 form-error" ng-bind="creationError"></div>
          </div>
        </div>
      </form>

      <form class="edit-schedule-form" ng-repeat="schedule in schedules" id="editScheduleForm_{{$index}}"
            name="editScheduleForm"
            ng-submit="updateSchedule(schedule, editScheduleForm);" ng-show="schedules && (schedules.length > 0)"
            novalidate>
        <input type="hidden" ng-model="backupScheduleRow"/>

        <div ng-class="schedulesBackupMap[schedule.id].editFormActive">
          <div class="row-fluid list-row">
            <div class="span1">
              <input id="editButton{{$index}}" type="button"
                     ng-hide="schedulesBackupMap[schedule.id].edit"
                     class="btn btn-mini pull-right"
                     openlmis-message="button.edit"
                     ng-click="startScheduleEdit(schedule, backupScheduleRow); schedulesBackupMap[schedule.id].edit=true;"/>
            </div>

            <div class="span2" style="overflow: visible;">
              <span ng-hide="schedulesBackupMap[schedule.id].edit" ng-bind="schedule.code"></span>
              <input id="code_{{$index}}" name="code" ng-show="schedulesBackupMap[schedule.id].edit"
                     type="text"
                     ng-model="schedule.code" maxlength="50"
                     ng-required="true" openlmis-message="placeholder.code"/>
              <span ng-show="schedulesBackupMap[schedule.id].edit" class="label-required">*</span>
              <span class="form-error" ng-show="editScheduleForm.code.$error.required && showErrorForEdit"
                    openlmis-message="missing.value"></span>
            </div>

            <div class="span2">
              <span ng-hide="schedulesBackupMap[schedule.id].edit" ng-bind="schedule.name"></span>
              <input id="name_{{$index}}" name="name" ng-show="schedulesBackupMap[schedule.id].edit"
                     type="text"
                     ng-model="schedule.name" maxlength="50"
                     ng-required="true" openlmis-message="placeholder.name"/>
              <span ng-show="schedulesBackupMap[schedule.id].edit" class="label-required">*</span>
              <span class="form-error" ng-show="editScheduleForm.name.$error.required && showErrorForEdit"
                    openlmis-message="missing.value"></span>
            </div>

            <div class="span4">
              <span ng-hide="schedulesBackupMap[schedule.id].edit" ng-bind="schedule.description"></span>
              <input id="desc_{{$index}}" name="desc" ng-show="schedulesBackupMap[schedule.id].edit"
                     type="text"
                     ng-model="schedule.description"
                     maxlength="250" openlmis-message="placeholder.description.optional"/>
            </div>

            <div class="span2">
              {{schedule.stringModifiedDate}}
            </div>

            <div class="span1">
              <input id="addPeriod" ng-hide="schedulesBackupMap[schedule.id].edit" type=button
                     ng-click="navigateToPeriodFor(schedule)"
                     class="btn btn-small btn-primary" openlmis-message="schedule.add.period"/>
            </div>
          </div>

          <div ng-show="schedulesBackupMap[schedule.id].edit" class="row-fluid save-cancel-row">
            <div class="span1"></div>
            <div class="span2">
              <input id="saveSchedule" type="submit" class="btn btn-primary btn-small"
                     openlmis-message="button.save"/>
              <input type="button" class="btn btn-cancel btn-small" openlmis-message="button.cancel"
                     ng-click="cancelScheduleEdit(schedule, backupScheduleRow); schedulesBackupMap[schedule.id].edit=false"/>
            </div>
            <div ng-show="schedulesBackupMap[schedule.id].error" class="span9 form-error"
                 ng-bind="schedulesBackupMap[schedule.id].error"></div>
          </div>
        </div>
      </form>
    </div>


    <br/>

    <div class="alert alert-error" id="saveFailMessage" ng-bind="errorInValidSchedule"
         ng-show="errorInValidSchedule"/>
  </div>
</div>
